<!-- 待处理收文 -->
<template>
	<view>
		<!-- <van-tabs color="#1989fa" animated title-active-color="#1989fa">
			<van-tab v-for="index in tabList" :title="index.tabName"> -->
				<van-list v-model="loading" :finished="finished" @load="load">
					<van-cell center v-for="item in newsList" :title="item.title" :label="'来文号：'+item.docNo"
						to="/pages/receive/receiveDocDetail" value-class="text-sm">
						<template #title>
							<span class="custom-title">{{item.title}}</span>
							<van-tag v-if="item.level=='1'" type="danger">加急</van-tag>
						</template>
						<template #extra>
							<van-button plain round type="info" size="small">查看详情</van-button>
						</template>
					</van-cell>
				</van-list>
			<!-- </van-tab>
		</van-tabs> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				tabList: [{
						tabName: '待处理'
					},
					{
						tabName: '办理中'
					},
					{
						tabName: '已办结'
					},
				],
				newsList: [{
						title: '民用航空空中交通通信导',
						docNo: '11111',
						level: '1'
					},
					{
						title: '民航局政府网站2021年',
						docNo: '22222'
					},
					{
						title: '民航局待处理收文',
						docNo: '33333'
					},
					{
						title: '民航局待处理收文',
						docNo: '44444',
						level: '1'
					},
					{
						title: '民航局待处理收文',
						docNo: '54321',
					},
				],
				loading: false,
				finished: false,
			}
		},
		methods: {
			onReady() {},
			load() {
				// 异步更新数据
				// setTimeout 仅做示例，真实场景中一般为 ajax 请求
				setTimeout(() => {
					// for (let i = 0; i < 10; i++) {
					// 	this.newsList.push(this.newsList.length + 1);
					// }

					// 加载状态结束
					this.loading = false;

					// 数据全部加载完成
					if (this.newsList.length >= 5) {
						this.finished = true;
					}
				}, 100);
			},
		},
	}
</script>

<style scoped>
	.custom-title {
		margin-right: 10px;
		vertical-align: middle;
	}
</style>
